import React from 'react'
// 引入store
// import store from '../redux/store'
// 引入actionCreator
import { setM } from '../redux/actions'

// useSelector的作用: 监听redux数据的变化,当前组件使用的数据发生变化,则当前组件更新,其他组件不更新
// useDispatch的作用: 返回dispatch函数
import { useSelector, useDispatch } from 'react-redux'

export default function Ls() {
  console.log('ls更新了')

  const msg = useSelector((state) => {
    // state就是redux中的所有数据
    //当前组件要使用哪个数据,就return对应的数据
    return state.ls.msg
  })

  // 这个dispatch就是store.dispatch
  const dispatch = useDispatch()

  return (
    <div>
      <input
        type="text"
        onKeyUp={(e) => {
          if (e.keyCode === 13) {
            dispatch(setM(e.target.value))
          }
        }}
      />
      <p>{msg}</p>
    </div>
  )
}
